<template>
	<el-dialog v-model="props.isShow" width="500" top="20vh" close-icon="CloseBold" title="USDT支取" @close="closeEvent">
		<template #default>
			<div class="flex flex-col items-center">
				<img src="/person/timer-fill.svg" class="w-70px h-70px"/>
				<p class="text-#000000 text-18px font-bold mb-10px mt-10px">支取待确认</p>
				<div class="w-full text-#000000 text-14px mb-6px flex items-center justify-between">
					<p>可获得数量</p>
					<p>2000.00 USDT</p>
				</div>
				<div class="w-100% mt-20px bg-#F6F6F6 pt-20px pl-20px pr-20px box-border">
					<div class="h-60px">
						<el-steps direction="vertical" :active="4" class="step-financing-row">
							<el-step>
								<template #icon>
									<img src="/financing/step.svg" class="relative top--10px" />
								</template>
								<template #title>
									<div class="flex items-center justify-between text-12px relative top--10px">
										<p class="text-#86909C">存入日期</p>
										<p class="text-#000000">2023-04-02 12:00</p>
									</div>
								</template>
							</el-step>
							<el-step>
								<template #icon>
									<img src="/financing/step.svg" class="relative top--10px" />
								</template>
								<template #title>
									<div class="flex items-center justify-between text-12px relative top--10px">
										<p class="text-#86909C">赎回到账日期</p>
										<p class="text-#000000">2023-04-02 12:00</p>
									</div>
								</template>
							</el-step>
						</el-steps>
					</div>
				</div>
			</div>
		</template>
		<template #footer>
			<div class="flex items-center justify-between mt-50px">
				<el-button type="primary" color="#ECECF0" style="color:#000000;height:50px;width:48%;">前往理财账户</el-button>
				<el-button type="primary" color="#114CEE" style="color:#ffffff;height:50px;width:48%;">查看历史</el-button>
			</div>
		</template>
	</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
interface IProps {
	isShow: boolean
}

const props = defineProps<IProps>();

const emit = defineEmits(['close'])
const closeEvent = () => {
	emit('close', false)
}
</script>
<style lang="scss">
	.step-financing-row{
		
		.el-step__icon{
			background-color: #114cee00;
		}
	}
</style>
